<template>
  <div class="xq">
    <div class="xqtp">
      <img :src="tabledata.GoodImg" width="500px" height="600px" alt="" />
    </div>
    <div class="xqsj">
      <h3>{{tabledata.GoodName}}</h3>
      <br />
      <p>{{tabledata.GoodArea}}</p>
      <br />
      <p>￥{{tabledata.GoodPrice}}</p>
      <br />
      <p>{{tabledata.GoodBanben}}</p>
      <br />
      <p>{{tabledata.color}}</p>
      <br />
      <p>总计:￥{{tabledata.GoodPrice}}</p>
      <br />
      <p>
        <button @click="addcar">加入购物车</button>
      </p>
    </div>
  </div>
</template>

<script>
export default {
  data(){
    return{
      tabledata:{
         GoodId:'',
      GoodName:'',
      GoodPrice:'',
      GoodArea:'',
      GoodBanben:'',
      GoodColor:'',
      GoodImg:'',
      GoodCount:''
      },
      Carform:{
        GoodId:'',
        UserId:'',
        CarCount:''
      }
    }
  },
  methods:{
    getgood(){
      var sd=this.$route.params.GoodId
     this.$axios({
       url:'http://localhost:13443/api/Goods/EditGood',
       Method:'get',
       params:{
          GoodId:sd
       }
     }).then(res=>{
        this.tabledata=res.data;
     })
    },
    addcar(){
      let userid = sessionStorage.getItem("userid");
      this.Carform.GoodId=this.tabledata.GoodId,
      this.Carform.CarCount=1
      this.Carform.UserId=userid
      this.$axios({
        url:'http://localhost:13443/api/Goods/AddShopCar',
        method:'post',
       data:this.Carform
      }).then(res=>{
        if(res.data>0)
        {
          alert('添加成功');
          this.$router.push('/ShopCar')
        }
      })
    }
  },
  created(){
    this.getgood();
  }
};
</script>

<style>
.xq {
  width: 1300px;
  height: 770px;
  margin: 0 auto;
}
.xqtp {
  width: 645px;
  height: 760px;
  float: left;
}
.xqsj {
  width: 645px;
  height: 760px;
  float: right;
}
</style>